import React, { lazy } from 'react'
import { Navigate } from 'react-router-dom'
import AppLayout from '../layout'

import Login from '../pages/login'
import { IRoute } from './types'
import Home from '../pages/home'
import {
  MenuUnfoldOutlined,
  MenuFoldOutlined,
  UserOutlined,
  VideoCameraOutlined,
  UploadOutlined,
} from '@ant-design/icons'

const Setting = lazy(() => import('../pages/setting'))
const Content = lazy(() => import('../pages/content'))
const Fans = lazy(() => import('../pages/fans'))
const Comment = lazy(() => import('../pages/comment'))
const Material = lazy(() => import('../pages/material'))
const Essay = lazy(() => import('../pages/essay'))

export const routes: IRoute[] = [
  {
    path: '/',
    element: <Navigate replace to="/login" />,
  },
  {
    path: '/login',
    element: <Login />,
  },

  {
    path: '/layout',
    element: <AppLayout />,
    children: [
      {
        path: '/layout',
        element: <Navigate to="/layout/home" />,
      },
      {
        path: '/layout/home',
        title: '首页',
        icon: <UserOutlined />,
        element: <Home />,
      },
      {
        path: '/layout/content',
        title: '内容管理',
        icon: <UserOutlined />,
        element: <Content />,
      },
      {
        path: '/layout/material',
        title: '素材',
        icon: <UserOutlined />,
        element: <Material />,
      },
      {
        path: '/layout/essay',
        title: '发布文章',
        icon: <UserOutlined />,
        element: <Essay />,
      },
      {
        path: '/layout/comment',
        title: '评论管理',
        icon: <UserOutlined />,
        element: <Comment />,
      },
      {
        path: '/layout/fans',
        title: '粉丝管理',
        icon: <UserOutlined />,
        element: <Fans />,
      },
      {
        path: '/layout/setting',
        title: '个人设置',
        icon: <UserOutlined />,
        element: <Setting />,
      },
    ],
  },
]
// Prompt
